<template>
	<!-- 报名人员信息 -->
	<view class="" style="padding: 0 35rpx;">

		<view style="background-color: #fff;border-radius: 10rpx;padding: 35rpx;"
			@click="navTo(`/reservationorder/details?OrderID=${SignUpNoticeDetail.ReservationOrderID}` )">
			<view class="flexbc" style="clear:both;">
				<view class="noticeTitle">
					<text>约 {{ SignUpNoticeDetail.ClassName }}</text>
					<text style="margin-left:0rpx">・</text>
					<text v-if="SignUpNoticeDetail.PriceType && JSON.parse(SignUpNoticeDetail.PriceType).value === 1">
						<text>¥</text>
						<text
							v-if="SignUpNoticeDetail.PriceQujian === 0">{{ SignUpNoticeDetail.Price|formatPrice }}</text>
						<text v-else>{{ SignUpNoticeDetail.StartPrice|formatPrice }} ~
							{{ SignUpNoticeDetail.EndPrice|formatPrice }}</text>
						<text>{{ JSON.parse(SignUpNoticeDetail.Unit).text}}</text>
					</text>
					<text
						v-else>{{SignUpNoticeDetail.PriceType ? JSON.parse(SignUpNoticeDetail.PriceType).result : '' }}</text>
				</view>
				<view>
					<fui-icon name="location" :size="28"></fui-icon>
					<text class="onCity">{{ SignUpNoticeDetail.City?SignUpNoticeDetail.City:'全国' }}</text>
				</view>
			</view>
			<view class="flexbc">
				<view class="leftTexts">
					<view style="font-size:24rpx;color:#999;padding-top:10rpx;padding-bottom:10rpx;">
						{{SignUpNoticeDetail.ReservationOrderMemo}}</view>
				</view>
			</view>
		</view>

		<view class=""
			style="background-color: #fff;border-radius: 10rpx;padding: 35rpx;display: flex; flex-direction: row; justify-content: space-between; align-items: center;margin-top: 20rpx;">
			<view class=""
				style="display: flex; flex-direction: row; justify-content: flex-start; align-items: center;">
				<image :src="SignUpNoticeDetail.SignupWxHeadPic" mode=""
					style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image>
				<view class="" style="margin-left: 20rpx;">
					<view class="" style="font-size: 26rpx;" v-if="SignUpNoticeDetail.SignupUserSex ">
						<text>{{ SignUpNoticeDetail.SignupNickName }}</text>
						<!-- <image v-if="JSON.parse(SignUpNoticeDetail.SignupUserSex).value == 0" :src="baseUrl + 'icon/girl.png'" mode="widthFix" style="width: 30rpx;height: 30rpx;"></image>
						<image v-if="JSON.parse(SignUpNoticeDetail.SignupUserSex).value == 1" :src="baseUrl + 'icon/boy.png'" mode="widthFix" style="width: 30rpx;height: 30rpx;"></image> -->
					</view>
					<view class="" style="font-size: 24rpx; margin-top: 10rpx;"
						v-if="SignUpNoticeDetail.PublicUserRoles">
						<text v-for="(itm, idx) in SignUpNoticeDetail.PublicUserRoles" :key="idx">
							<text> {{ itm }} </text>
							<text v-if="idx != (SignUpNoticeDetail.PublicUserRoles.length - 1)"
								style="padding: 0 10rpx;">·</text>
						</text>
					</view>
				</view>
			</view>
			<view class="">
				<view class="" style="font-size: 22rpx;color: #cfcfcf;">
					{{ $common.timeDiff( SignUpNoticeDetail.addTime , new Date()) }}
				</view>
				<view class="" style="font-size: 24rpx;color: #bfbfbf;text-align: right; margin-top: 10rpx;"
					@click="navTo(`/pages/index/complaint/index?UserID=${SignUpNoticeDetail.UserID}`)">
					<text>投诉</text>
				</view>
			</view>
		</view>
		<view class="" style="background-color: #fff;border-radius: 10rpx;padding: 35rpx;margin-top: 20rpx;">
			<view class="" style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;">
				<text class="" style="width: 8rpx;height: 30rpx;background-color: #FFDD00;"></text>
				<text class="" style="font-size: 26rpx;margin-left: 20rpx;">对方报名信息</text>
			</view>
			<view class="" style="font-size: 24rpx;margin-top: 20rpx;">
				报名备注: {{ SignUpNoticeDetail.SignupMemo }}
			</view>
		</view>

		<view class="" style="background-color: #fff;border-radius: 10rpx;padding: 35rpx; margin-top: 20rpx;">
			<view class="" style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;">
				<view class="" style="width: 8rpx;height: 30rpx;background-color: #FFDD00;"></view>
				<view class="" style="font-size: 26rpx;margin-left: 20rpx;">对方联系方式</view>
			</view>
			<view class="" style="margin-top: 20rpx;font-size: 24rpx;">
				<view class=""
					style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;">
					<text style="flex: 1;">联系人:</text>
					<text style="flex: 2;text-align: left;">{{ SignUpNoticeDetail.ContactName }}</text>
					<text style="flex: 1;"></text>
				</view>
				<view class=""
					style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;margin-top: 20rpx;">
					<text style="flex: 1;">微信号:</text>
					<text style="flex: 2;text-align: left;">{{ SignUpNoticeDetail.WeixinCode }}</text>
					<text style="flex: 1;text-align: right; color:#68cee7;"
						@click="onCopy(SignUpNoticeDetail.WeixinCode,'微信号')">复制</text>
				</view>
				<view class=""
					style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;margin-top: 20rpx;">
					<text style="flex: 1;">手机号:</text>
					<text style="flex: 2;text-align: left;">{{ SignUpNoticeDetail.UserMobile }}</text>
					<text style="flex: 1;text-align: right;color:#68cee7;"
						@click="onCopy(SignUpNoticeDetail.UserMobile,'手机号')">复制</text>
				</view>
				<view class=""
					style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;margin-top: 20rpx;">
					<text style="flex: 1;">QQ号:</text>
					<text style="flex: 2;text-align: left;">{{ SignUpNoticeDetail.QQCode }}</text>
					<text style="flex: 1;text-align: right;color:#68cee7;"
						@click="onCopy(SignUpNoticeDetail.QQCode,'手机号')">复制</text>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				options: {},
				SignUpNoticeDetail: {}
			}
		},
		onLoad(options) {
			this.baseUrl = this.$baseUrl;
			// console.log('options', options)
			this.options = options
			this.getSignUpReservationOrderDetail()
		},
		onShow() {},
		methods: {
			navTo(url) {
				uni.navigateTo({
					url
				})
			},
			onCopy(data, text) {
				uni.setClipboardData({
					data,
					showToast: false,
					success: res => {
						uni.showToast({
							title: `复制${text}成功`,
							icon: 'success'
						})
					}
				})
			},
			getSignUpReservationOrderDetail() {
				this.$httpost('/ReservationOrders/ReservationOrderSignUpDetail', this.options).then(res => {
					// console.log('ReservationOrderDeteil', res)
					if (res.code == 200) this.SignUpNoticeDetail = res.data.ReservationOrderDetail
				})
			},
		},
	}
</script>

<style>
</style>